<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>菜单管理</title>
        <meta name="renderer" content="webkit">
        <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
        <meta http-equiv="Access-Control-Allow-Origin" content="*">
        <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
        <meta name="_token" content="{{ csrf_token() }}">
        <meta name="apple-mobile-web-app-status-bar-style" content="black">
        <meta name="apple-mobile-web-app-capable" content="yes">
        <meta name="format-detection" content="telephone=no">
        <link rel="stylesheet" href="/assets/css/layui.css" media="all" />
        <script src="/js/jquery.min.js"></script>
        <style type="text/css">
            th,td{padding:5px 15px !important;}
        </style>
    </head>
    <body>
        <div class="" style="margin-top: 20px;margin-left:20px;">
            <button class="layui-btn layui-btn-blue layui-btn-sm" onclick="addCate()"><i class="layui-icon">&#xe654;</i>新增</button>
            <button class="layui-btn layui-btn-blue layui-btn-sm" id="expand">全部展开</button>
            <button class="layui-btn layui-btn-blue layui-btn-sm" id="collapse">全部收起</button>
            <a class="layui-btn layui-btn-blue layui-btn-sm" title="刷新当前页" href="javascript:void(0);" onclick="layer.load(1);window.location.reload(true);"><i class="layui-icon"></i>刷新</a>
            <div id="demo"></div>
        </div>
    </body>
    <script type="text/javascript" src="/assets/layui.js"></script>
    <script type="text/javascript" src="/js/jquery.min.js"></script>
    <script type="text/javascript">
        var nodesarr=[];
        var nodesarrs=[];
        $.ajax({
            type: 'GET',
            url: "{{ route('admin.cates') }}",
            success: function(datas){
                nodesarrs=datas.data
                if (nodesarrs.length>0) {
                    tmd();
                }
            },
            error:function(datas) {
              alert('未知错误！！')
            },
        });
        var layout = [{name: 'id',field: 'id',headerClass: 'value_col',colClass: 'value_col'},
            {name: '菜单名称',treeNodes: true,headerClass: 'value_col',colClass: 'value_col'},
            {name: '操作',headerClass: 'value_col',colClass: 'value_col',style: 'width: 30%',
                render: function(row) {
                    return [
                        '<a class="layui-btn layui-btn-xs" lay-event="add"   onclick="addSubcate(' + row.id + ')" title="添加"> <i class="layui-icon ">&#xe654;</i> </a>',
                        '<a class="layui-btn layui-btn-xs layui-btn-normal" lay-event="edit"   onclick="editCate(' + row.id + ')" title="编辑"> <i class="layui-icon ">&#xe642;</i> </a>',
                        '<a class="layui-btn layui-btn-xs layui-btn-danger" lay-event="del"   onclick="delCate(' + row.id + ')" title="删除"> <i class="layui-icon ">&#xe640;</i> </a>',
                    ].join('');
                }
            }
        ];
        function tmd(){
            layui.use(['form', 'treeGird', 'layer'], function() {
                var layer = layui.layer,
                    form = layui.form,
                    $ = layui.jquery;
                var tree1 = layui.treeGird({
                            elem: '#demo', //传入元素选择器
                            spreadable: true, //设置是否全展开，默认不展开
                            checkbox: false,
                            nodes:nodesarrs,
                            layout: layout
                });
                form.render();
                $('#collapse').on('click', function() {
                    layui.collapse(tree1);
                });
                $('#expand').on('click', function() {
                    layui.expand(tree1);
                });
            });
        }
        function addCate() {
            layui.use(['layer'], function() {
                var findex = layer.open({
                    type:2,
                    title:'新增分类',
                    content:"{{route('admin.addcate')}}"
                });
                layer.full(findex);
            });
        }
        function addSubcate($id) {
            var findex = layer.open({
                type:2,
                title:'新增子分类',
                content:"{{url('admin/addsubcate')}}"+'?id='+$id
            });
            layer.full(findex);
        }
        function editCate($id) {
            var findex = layer.open({
                type:2,
                title:'编辑分类',
                content:"{{url('admin/editcate')}}"+'?id='+$id
            });
            layer.full(findex);
        }
        function delCate($did) {
            layer.confirm('确认删除吗？', function(index){
                $.ajax({
                    type: 'POST',
                    url: "{{ route('admin.delcate') }}",
                    data:{id:$did},
                    dataType:'JSON',
                    headers: {
                        'X-CSRF-TOKEN': $('meta[name="_token"]').attr('content')
                    },
                    success: function(datas){
                      if(datas.code==200){
                        layer.msg('已删除!',{icon:1,time:3000});
                        // $("#"+$did).remove();
                        window.location.reload(true);
                      }else{
                        layer.msg('出错!',{icon:2,time:3000});
                      }
                    },
                    error:function(datas) {
                      alert('未知错误！')
                    },
                });
            });
        }
    </script>
</html>